{template "header.html"}

<link href="{THEME_PATH}assets/global/plugins/jcrop/css/jquery.Jcrop.min.css" rel="stylesheet" type="text/css" />
<script src="{THEME_PATH}assets/global/plugins/jcrop/js/jquery.color.js" type="text/javascript"></script>
<script src="{THEME_PATH}assets/global/plugins/jcrop/js/jquery.Jcrop.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(function () {
        $('#cut_image').Jcrop({
            aspectRatio: 1,
            onSelect: updateCoords
        });

        function updateCoords(c)
        {
            $('#crop_x').val(c.x);
            $('#crop_y').val(c.y);
            $('#crop_w').val(c.w);
            $('#crop_h').val(c.h);
        };

        $('#myform').submit(function(){
            if (parseInt($('#crop_w').val())) {

            } else {
                dr_tips(0, '{dr_lang('图形宽度不规范')}');
            }
            return false;
        });
    });

</script>

<form class="form-horizontal" method="post" role="form" id="myform">
    {$form}
    <div class="responsive-1024">
        <img src="{$data.url}?{SYS_TIME}" id="cut_image" />
    </div>
    <input type="hidden" id="crop_x" name="data[x]" />
    <input type="hidden" id="crop_y" name="data[y]" />
    <input type="hidden" id="crop_w" name="data[w]" />
    <input type="hidden" id="crop_h" name="data[h]" />
</form>

{template "footer.html"}